<template>
    <view id="root">
        <view class="uni-padding-wrap uni-common-mt" id="main-view">
            <navigator url="/pages/report/index" hover-class="other-navigator-hover">
                <button type="primary" style="background-color: #007AFF;" class="center">疫情上报</button>
            </navigator>
			<button type="primary" style="opacity:0" class="center">举报病情</button>
            <navigator url="/pages/query/index" hover-class="other-navigator-hover">
                <button type="primary" class="center" style="background-color: #007AFF;">疫情查询</button>
            </navigator>
			<button type="primary" style="opacity:0" class="center">举报病情</button>
			<navigator url="/pages/migrants/index" hover-class="other-navigator-hover">
			    <button type="primary" class="center" style="background-color: #007AFF;">外来人员登记</button>
			</navigator>
        </view>
    </view>
</template>

<script>
    import simpleAddress from "@/components/simple-address/simple-address.nvue"

    export default {
        data() {
            const currentDate = this.getDate({
                format: true
            })
            return {
                addressData: {},
                genderArray: ['男', '女'],
                credentials: ['身份证', '回乡证', '护照', "军官证", "同胞证", "港澳居民居住证"],
                credentialIndex: 0,
                genderIndex: 0,
                date: currentDate,
                time: '12:01',
                cityPickerValueDefault: [0, 0, 0],
                pickerText: '',
            }
        },
        onLoad() {

        },
        components: {
            simpleAddress
        },
        computed: {
            startDate() {
                return this.getDate('start');
            },
            endDate() {
                return this.getDate('end');
            }
        },
        methods: {
            openAddres() {
                this.$refs.simpleAddress.open();
            },
            onConfirm(e) {
                this.pickerText = e.label;
                this.addressData = e;
            },
            bindGenderChange: function (e) {
                this.genderIndex = e.target.value
            },
            bindCredentialChange: function (e) {
                this.credentialIndex = e.target.value
            },
            getDate(type) {
                const date = new Date();
                let year = date.getFullYear();
                let month = date.getMonth() + 1;
                let day = date.getDate();

                if (type === 'start') {
                    year = year - 60;
                } else if (type === 'end') {
                    year = year + 2;
                }
                month = month > 9 ? month : '0' + month;
                ;
                day = day > 9 ? day : '0' + day;
                return `${year}-${month}-${day}`;
            },
            bindDateChange: function (e) {
                this.date = e.target.value
            },
            formSubmit: function (e) {
                console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
                console.log(this.addressData)
                const formData = e.detail.value;
                console.log("ppppppp")
                console.log(this.addressData)
                if (this.addressData['provinceCode'])
                    formData['province_id'] = this.formatCode(this.addressData['provinceCode'])
                if (this.addressData['cityCode'])
                    formData['city_id'] = this.formatCode(this.addressData['cityCode'])
                if (this.addressData['areaCode'])
                    formData['area_id'] = this.formatCode(this.addressData['areaCode'])
                this.$http.HttpPostForm("involverInfos/", formData)
            },

            formatCode(code) {
                if (code.length === 6) {
                    return code;
                }
                let s = ""
                for (let i = 0; i < 6 - code.length; i++) {
                    s = s + "0"
                }
                return code + s;
            }
        }
    }
</script>

<style>
	#root{
		width: 100vw;
		height: 100vh;
		position: relative;
	}
	#main-view{
		position: absolute;
		top: 50%;
		left: 50%;
		width: 100vw;
		transform: translate(-50%, -50%);
	}

    .uni-form-item .title {
        padding: 20rpx 0;
    }

    #ta-remark {
        min-height: 100rpx;
    }

    .radio {
        top: 50%;
        transform: translate(0%, 25%);
    }

    .title {
        font-size: 50rpx;
        font-weight: bold;
        margin-bottom: 30rpx;
    }

    .sub-title {
        font-size: 35rpx;
        margin-bottom: 25rpx;
    }

    .divider {
        margin-top: 20rpx;
        margin-bottom: 20rpx;
        background-color: #DDDDDD;
        height: 1rpx;
        width: 100%;
        border: none;
    }

    .label {
        display: flex;
        position: relative;
    }
</style>
